<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://eureka.yigolden.net/stringutils/sutaglib/1.0"
	prefix="su"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<title>用户自动分组</title>

<!-- Bootstrap -->
<link href="<%=request.getContextPath()%>/static/css/bootstrap.min.css"
	rel="stylesheet">
<link
	href="<%=request.getContextPath()%>/static/css/bootstrap-theme.min.css"
	rel="stylesheet">
<link href="<%=request.getContextPath()%>/static/css/jumbotron.css"
	rel="stylesheet">

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
      <script src="<%=request.getContextPath()%>/static/js/html5shiv.min.js"></script>
      <script src="<%=request.getContextPath()%>/static/js/respond.min.js"></script>
    <![endif]-->
    <style>
    	td{
    	  text-align:center;
    	}
    </style>
</head>
<body>
	<jsp:include page="../Common/navHeader.jsp"></jsp:include>

	<div class="container">

		<br> <br>
		<div class="row">
			<div class="col-lg-3 col-sm-2"></div>
			<!--左侧不用-->
			<div class="col-lg-6 col-sm-8 col-xs-12 text-center">
				<h3>用户手动即时分组</h3>
			</div>
			<!-- /.col-sm-4 -->
			<div class="col-lg-3 col-sm-2"></div>
			<!--右侧不用-->
		</div>

		<br /> <br />

		<div class="row">
			<jsp:include page="navLeftBarForGrouping.jsp"></jsp:include>
			<div class="col-sm-9 col-xs-12">

				<c:set var="i" value="0" />
				<c:if test="${results ne null }">
					<c:set var="i" value="0" />
					<c:forEach var="item" items="${results}">
						<c:set var="i" value="${i + 1 }" />
						<div class="table-responsive">
							<table id="userTable" class="table table-hover table-stripped">
								<tr>
									<td style="vertical-align:middle;border-width:1px;border-style:solid;border-color:#ddd;" rowspan="${fn:length(item)+ 2}">类别 ${i}</td>
									<td style="min-width: 60px;background: aliceblue;">用户名</td>
									<td style="background: aliceblue;" >性别</td>
									<td style="background: aliceblue;" >所在单位</td>
									<td style="background: aliceblue;" >休息时间</td>
									<td style="background: aliceblue;" >起床时间</td>
									<td style="background: aliceblue;" >民族</td>
									<td style="background: aliceblue;" >信仰</td>
									<td class="text-center" style="background: aliceblue;border-right-width:1px;border-right-style:solid;border-right-color:#ddd;" >操作</td>
								</tr>
	
								<c:forEach var="subitem" items="${item }">
								<tr>
								<td><a
									href="<%=request.getContextPath() %>/Account/ShowUserDetailInfo?userid=${subitem.userid }"
									target="_blank">${fn:escapeXml(subitem.username) }</a></td>
								<td>${fn:escapeXml(subitem.gender) }</td>
								<td>${fn:escapeXml(subitem.universityName) }</td>
								<td>${fn:escapeXml(subitem.sleeptimeformatted) }</td>
								<td>${fn:escapeXml(subitem.wakeuptimeformatted) }</td>
								<td>${fn:escapeXml(subitem.nation) }</td>
								<td>${fn:escapeXml(subitem.belief) }</td>
								<td class="text-center" style="border-right-width:1px;border-right-style:solid;border-right-color:#ddd;"><a href="#"
									class="addMessageLink btn btn-success"
									data-destination="${subitem.userid}">申请</a></td>
									</tr>
								</c:forEach>
								<tr>
									<td style="text-align:left;background: aliceblue;border-right-width:1px;border-right-style:solid;border-right-color:#ddd;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:#ddd;" colspan="8">
									描述： 
									适合学校在<strong>${estimationresults[i-1].universityName}</strong>，
									休息时间约在<strong>${estimationresults[i-1].sleeptimeformatted}</strong>，
									起床时间约在<strong>${estimationresults[i-1].wakeuptimeformatted}</strong>
									的<strong>${estimationresults[i-1].gender}性</strong>用户。
									</td>
								</tr>
								
							</table>
						</div>
					</c:forEach>
				</c:if>

				<c:if test="${results eq null }">
					<div class="alert alert-warning" role="alert">
						搜索失败！<br /> 原因可能是：<br /> 1.您的作休数据不完整<a
							href="<%=request.getContextPath() %>/Posting/AddPosting?domain=${su:encodeUriComponent(param.domain)}"
							role="button">前往完善&raquo;</a><br /> 2.当前还没有具有完善的个人详情数据和个人作休数据的用户<br />
						抱歉！<br />
					</div>
				</c:if>
				<br />
				<div class="alert alert-warning" role="alert">
					聚类规则如下：<br /> 1、使用Kmeans聚类算法。<br /> 2、目前参与聚类运算的用户信息只包括用户的所在单位、性别、睡觉时间和起床时间。<br />
					3、默认聚类数为5类，如果系统中的数据不足以产生5类，则聚类数以低于5的最大值计；如果大于等于5，则按5计。<br /> 
					4、未来将提供用户自动选定聚类个数功能。<br /> 
				</div>
			</div>
			<div class="col-sm-1"></div>
			<!--右侧不用-->
		</div>

		<footer
			style="padding-top: 19px; color: #777; border-top: 1px solid #e5e5e5">
			<p>&copy; 2016 江苏南京好室友网络科技有限公司</p>
		</footer>

	</div>

	<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
	<script src="<%=request.getContextPath()%>/static/js/jquery.min.js"></script>
	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script src="<%=request.getContextPath()%>/static/js/bootstrap.min.js"></script>

	<script type="text/javascript">
    window.addMessageBusy = false;
    
    $(document).ready(function() {
    	$("a.addMessageLink").click(function() {
			if (window.addMessageBusy) return false;
			window.addMessageBusy = true;

			$("a.addMessageLink").addClass("disabled");
			
    		var destination = $(this).data("destination");
    		
    		var postData = {destination : destination};
    		$.ajax({
    			method: "POST",
    			url: "<%=request.getContextPath()%>/Message/AddMessage",
				contentType : "application/json",
				data : JSON.stringify(postData),
				dataType : "json",
				success : function(data) {
						if (data.status == 0) {
							alert("申请成功！");
						} else {
							alert(data.message);
						}
					},
					error : function() {
						alert("服务器连接失败！");
					},
					complete : function() {
						$("a.addMessageLink").removeClass("disabled");
						window.addMessageBusy = false;
					}
				});

				return false;
			});
		});
	</script>
</body>
</html>